<!-- @format -->

<template>
  <div>
    <!-- 2. 展示数据 -->

    <!-- 2.1 直接放数据属性 -->
    <h2>{{ msg }}</h2>
    <!-- 2.2 对象.属性名 -->
    <p>我叫 {{ obj.name }}，今年 {{ obj.age }} 岁了</p>
    <!-- 2.3 算数运算 -->
    <p>来年我就 {{ obj.age + 1 }} 岁了</p>
    <!-- 2.4 三元运算 -->
    <p>小vue {{ obj.age >= 18 ? '成年了' : '未成年' }}</p>
    <!-- 2.5 函数/方法的调用 -->
    <p>msg由 {{ msg.split(',').length }} 个单词组成</p>
    <!-- 2.6 直接放字面量 -->
    <!-- <p>{{ [4, 5, 6] }}</p> -->
    <!-- <p>{{ '姬霓太美' }}</p> -->
  </div>
</template>

<script>
  export default {
    // 1. 声明(准备)数据
    data() {
      return {
        msg: 'Hello,Vue2',
        obj: {
          name: '小vue',
          age: 7
        }
      }
    }
  }
</script>

<style></style>
